import React,{Component} from 'react'
import { Toast, List, InputItem, WhiteSpace, Button, } from 'antd-mobile';
import { createForm } from 'rc-form'
import history from '../../history'

class LoginForm extends Component{
    constructor() {
        super();
    }

    submit = () => {
        this.props.form.validateFields((error, value) => {
            console.log(error, value);
           
            this.props.login(value)
            
        });
    }
        
    render() {
        let errors;
        const { getFieldProps, getFieldError} = this.props.form;

        return (
         <div className='login-box'>
            <h3>登录</h3>
            <List>
                <InputItem
                    placeholder="安全邮箱"
                    name="email"
                    {...getFieldProps('email',{
                        rules: [{required: true}]
                    })}
                ></InputItem>
            </List>
            <WhiteSpace />

            <List>
                <InputItem
                    {...getFieldProps('password', {
                        // initialValue: '888888'
                    })}
                    placeholder="密码"
                    name="password"
                    type='password'
                ></InputItem>
            </List>
            <WhiteSpace />
            <div className='extra'>
                <a onClick={()=>history.push('/register')}>现在去注册</a>
                <a>忘记密码？</a>
            </div>

            <WhiteSpace size="xl" />
            <Button className="btn btn-primary" type="primary" onClick={this.submit}>登录</Button>
            <WhiteSpace size="xl" />
         </div>
        );
  }
}

export default createForm()(LoginForm);